<template>
    <div>
        <van-nav-bar title="城市选择" left-text="返回" left-arrow @click-left="proxy.$leftClick()" />
        <van-index-bar highlight-color="blue">
            <template v-for="item in store.dataList">
                <van-index-anchor :index="item.letter.toUpperCase()" class="indexs"/>
                <van-cell :title="data.name" v-for="data in item.data"  @click="store.changeCs(data)"/>
            </template>
        </van-index-bar>
        <van-back-top />
    </div>
</template>

<script setup lang="ts">
import { usecs } from '@/store/cs';
import { getCurrentInstance, onBeforeMount } from 'vue';
const store = usecs();
const {proxy}:any = getCurrentInstance();

onBeforeMount(() => {
    // 在组件渲染前 获取城市数据
    store.fetchGetData();
})

</script>

<style lang="scss">
$color:#eff2f5;
.indexs{
    background-color: $color;
}
</style>